<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>淘票票</title>
  <script src="js/axios.min.js"></script>
  <style>
    body {
      background-color: blueviolet;
    }

    div {
      width: 400px;
      height: 300px;
      margin: 200px auto;
    
      background-color: #fff;
    }

    h2 {
      text-align: center;
    }

    input:nth-child(3) {
      margin-left: 30px;
      margin-bottom: 20px;
    }

    input:nth-child(5) {
      margin-left: 46px;
      margin-bottom: 20px;
    }

    input:nth-child(7) {
      margin-left: 155px;
    }
  </style>
</head>

<body>
  <div>
    <h2>淘票票新用户注册</h2><br>
    用户名：<input type="text" name="" id="" /><br>
    密码：<input type="text" name="" id="" /><br>
    <input type="button" name="" id="" value="注册" />
  </div>

  <script>
    //1-给注册按钮加事件
    let ipts = document.querySelectorAll("input");
    ipts[2].onclick = function () {
      let uname = ipts[0].value;
      let pd = ipts[1].value;

      //2-请求
      let regAPI = "http://jx.xuzhixiang.top/ap/api/reg.php";
      axios
        .get(regAPI, {
          params: {
            username: uname,
            password: pd
          }
        })
        .then((r) => {
          console.log(r.data);
          alert(r.data.msg);
          if (r.data.code == 1) {
            location.href = "login.html";
          }
        });
    };
    
  </script>
</body>

</html>